<style lang="less">
  .charging-rule {
  }
</style>

<template>
  <div class="charging-rule">
    <ue-search-bar ref="ueSearchBar" v-model="searchCondition" :data="querys" label-width="100px" >
    </ue-search-bar>
    <el-col :span="24" style="margin-bottom: 10px">
      <el-col :span="12">
        <el-button type="primary" @click="addClick">新增</el-button>
      </el-col>
      <el-col :span="12" style="text-align: right">
        <el-button type="primary" @click="search">查询</el-button>
        <el-button type="primary" @click="resetSearchCondition">重置</el-button>
      </el-col>
    </el-col>
    <el-table highlight-current-row max-height="680"
              border
              :data="tableData"
              v-loading="listLoading"
              style="width: 100%;">
      <el-table-column type="index" width="55">
      </el-table-column>
      <el-table-column prop="number" label="规则编号" width="105">
      </el-table-column>
      <el-table-column prop="standardPriceNumber" label="标准运价编号" width="170">
      </el-table-column>
      <el-table-column prop="standardPriceName" label="标准运价名称" width="180">
      </el-table-column>
      <el-table-column prop="standardPriceVersionName" label="使用版本" width="95">
      </el-table-column>
      <el-table-column label="计算公式" min-width="200">
        <template slot-scope="scope">
          <div v-if="scope.row.startingPriceAdjustment">起步价+{{scope.row.startingPriceAdjustment}}</div>
          <div v-for="item in scope.row.chargingFormulas" :key="item.id">{{item.description}}</div>
        </template>
      </el-table-column>
      <el-table-column prop="digitalFormatName" label="数值格式" width="95">
      </el-table-column>
      <el-table-column prop="createDate" label="创建日期" width="180">
      </el-table-column>
      <el-table-column prop="statusName" label="启用状态" width="95">
      </el-table-column>
      <el-table-column label="操作" min-width="200">
        <template slot-scope="scope">
          <el-button type="primary" v-if="scope.row.status ===111002002"   @click="editClick(scope.row)">编辑</el-button>
          <el-button type="primary" v-if="scope.row.status ===111002002"  @click="generateFreightClick(scope.row.id)">生成运价</el-button>
          <el-button type="primary" v-if="scope.row.status ===111002001"  @click="viewClick(scope.row)">查看</el-button>
          <el-button type="primary"  @click="estimatePriceClick(scope.row)">运价预估</el-button>
          <el-button type="danger" v-if="scope.row.status ===111002002"   @click="removeClick(scope.row.id)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-col :span="24" class="toolbar">
      <el-pagination
        :current-page="page"
        :page-size="size"
        @size-change="handleSizeChange"
        @current-change="handleCurrentPageChange"
        layout="total,sizes,prev, pager, next, jumper"
        :total="total" style="float: right">
      </el-pagination>
    </el-col>
    <charging-rule-add ref="chargingRuleAdd" @comfirmSuccess="comfirmSuccess"></charging-rule-add>
    <estimate-price ref="estimatePrice"></estimate-price>
  </div>
</template>

<script>
import {
  getAllChargingRules,
  createChargingRule,
  // updateChargingRule,
  generateFreight,
  deleteChargingRule
} from '../../../api/freight/ChargingRule';
import ChargingRuleAdd from './ChargingRuleAdd.vue';
import EstimatePrice from './EstimatePrice.vue';
export default {
  components: {
    EstimatePrice,
    ChargingRuleAdd},
  data () {
    return {
      searchCondition: {},
      tableData: [],
      page: 1,
      size: 10,
      total: 0,
      listLoading: false
    };
  },
  methods: {
    generateFreightClick (id) {
      this.$confirm('您确认要生成该运价文件?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        generateFreight(id).then(res => {
          if (res.data.successFlg) {
            this.$message({
              type: 'success',
              message: '运价生成成功!'
            });
            this.search();
          } else {
            this.$message.error(res.data.errorMsg);
          }
        });
      }).catch(() => {});
    },
    estimatePriceClick (row) {
      this.$refs.estimatePrice.show(row);
    },
    comfirmSuccess (o) {
      createChargingRule(o).then(res => {
        if (res.data.successFlg) {
          this.$message({
            type: 'success',
            message: '添加成功!'
          });
          this.search();
        } else {
          this.$message.error(res.data.errorMsg);
        }
      });
    },
    editClick (row) {
      this.$refs.chargingRuleAdd.show(row);
    },
    viewClick (row) {
      this.$refs.chargingRuleAdd.show(row, true);
    },
    removeClick (id) {
      this.$confirm('您确认删除该计费规则?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteChargingRule(id).then(res => {
          if (res.data.successFlg) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
            this.search();
          } else {
            this.$message.error(res.data.errorMsg);
          }
        });
      }).catch(() => {});
    },
    addClick () {
      this.$refs.chargingRuleAdd.show();
    },
    handleSizeChange (val) {
      this.size = val;
      this.search();
    },
    handleCurrentPageChange (val) {
      this.page = val;
      this.search();
    },
    search () {
      this.listLoading = true;
      getAllChargingRules({
        filters: '' + this.$ue.objToFilter(this.searchCondition),
        sorts: '-number',
        page: this.page,
        size: this.size
      }).then(res => {
        if (res.data.successFlg) {
          this.listLoading = false;
          this.tableData = res.data.detailModelList;
          this.total = res.data.totalCount;
        } else {
          this.$message.error(res.data.errorMsg);
        }
      });
    },
    resetSearchCondition () {
      this.$refs.ueSearchBar.reset();
    }
  },
  computed: {
    btns () {
      return this.$store.state.btns[this.$route.path] || [];
    },
    querys () {
      return this.$store.state.querys[this.$route.path + '#default'] || [];
    }
  },
  mounted () {
    this.search();
    this.$store.commit('initStowages');
    this.$store.commit('initDict');
  }
};
</script>
